<template>
	<view class="_notice">
		<image src="/static/icon_gonggao.png"></image>
		<swiper class="_swiper tc" @change="slideChange" :indicator-dots="false" :autoplay="true" :interval="interval" :circular="true"
		 display-multiple-items="2" :duration="duration">
			<swiper-item v-for="(item,index) in list" :key="index">
				<view class="swiper-item uni-bg-red">{{item}}</view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	export default {
		props: {
			//显示数据
			list: {
				type: Array,
				defual:function(){
					return [];
				}
			},
		},
		data() {
			return {
				interval:3000,
				duration:12000,
			};
		},
		methods:{
			slideChange(e){
				this.$emit('getCurrentIndex',e.detail.current); 
				
			}
		}
	};
</script>

<style lang="scss">
	._notice {
		position: fixed;
		left: 0;
		top: 0;
		/* #ifdef H5 */
		top: 88upx;
		/* #endif */
		z-index: 9;
		width: 100%;
		// padding-left: 120upx;
		// background: rgba(72, 1, 1, 0.3);
		font-size: 20upx;
		height: 68upx;
		color: #000;
		// border-radius: 6upx;
		overflow: hidden;
		box-sizing: border-box;
		
		padding-left: 30upx;
		display: flex;
		flex-flow: row nowrap;
		justify-content: flex-start;
		align-items: center;
		background-color: #FFF5D9;
		
		image {
			width: 41upx;
			height: 36upx;
			margin-right: 20upx;
		}
		
		.text {
			
			height: 100%;
			font-size: $font-sm + 4upx;
			color: #232323;
		}
	}
	._swiper {
		flex: 1;
		height: 68upx;
		line-height: 68upx;
	}
	.swiper-item {
		flex: 1;
		height: 68upx;
		margin-right: 20upx;
	}
</style>